import React, { useState, useEffect} from 'react';
import { useHistory } from "react-router-dom";  
import http from '../../../model/http';
import code from "../../../model/code";
import './eventInvitation.less'; 
import {Badge,ActivityIndicator, List, Toast, Modal, Button, Flex} from 'antd-mobile';
import Header from "../../../components/header/Header";
import biaozhunImg from '../../../libs/font/img/biaozhun.png'
import huodongImg from '../../../libs/font/img/huodong.png'

function EventInvitation(){
    const history = useHistory();
    // 列表数据
    const [listData,setListData] = useState([])

    const searchBtn = (item) => {
        console.log('触发') 
        console.log(item) 

        history.push(`/clientReview/eventInvitation/userList?taskId=${item.task_id}&groupId=${item.group_id}`)
    }
    /*渲染完成*/
    useEffect(async () => { 
        const result = await http.post('/callcenter/workbenchInviteTask')
        if(result.code == 0){
            setListData(result.data)
        }
          
    }, [])


    // 随机颜色
    const randomFunction = () => {
        let items = [1,2,3];
        let randomItem = items[Math.floor(Math.random() * items.length)];
        return randomItem
    }
    return (
        <div className="v-event-invitation">
            <div className="invitation-content">
                {listData.length > 0 && listData.map(item => (
                    <div onClick={() => searchBtn(item)}> 
                        <div className={randomFunction() == 1?'box':(randomFunction() == 2?'box changpin':(randomFunction() == 3?'taochang box':'taochang box'))}> 
                            <div className={`iconfont icon-huodong icon-box-search`}></div>
                            <p>{item.task_name}-{item.remark}</p>
                            {/* <p>{item.task_name}<div className="iconfont icon-youjiantou1 icon-box-search2"></div></p>
                            <span>{item.remark}</span> */}
                        </div>  
                    </div> 
                ))}
                
                {listData.length < 1?<div className="no-data">暂无更多数据</div>:''}
                
            </div>
            <Header />
        </div>
    )
}
export default EventInvitation;